<template>
  <div>
    <div
      class="add"
      @click="edit()"
    >提报隐患</div>
    <eagle-page-list
      url="/DangerCheckTaskDetail/GetPageData"
      :queryParams="params"
      @bindData="bindData"
      ref="eaglePageList"
    >
      <template slot="list">
        <eagle-cell style="margin:10px 0px 0px 0px;" class="card" v-for="(item, index) in list" :key="index">
          <eagle-tag
            v-if="item.Status < 20"
            class="info_tag"
            type="warning"
            >未提交
          </eagle-tag>
          <eagle-tag
            v-if="item.Status >=20"
            class="info_tag"
            type="normal"
            >已提交
          </eagle-tag>
          <div class="warn_item">
            <div @click="goDetail(item)">
              <div class="warn_header">
                <div>
                  {{ index + 1 }}、隐患描述：{{ item.HiddenDangerDesc }}
                </div>
              </div>
              <eagle-row class="dep_sort">
                <eagle-col span="24">
                  <img
                    src="@/assets/Images/AppIcon/icon_list_type.png"
                    alt=""
                  />{{
                    "隐患区域：" + (item.HiddenDangerArea || "无")
                  }}</eagle-col
                >
              </eagle-row>

              <eagle-row class="dep_sort">
                <eagle-col span="8">
                  <img
                    src="@/assets/Images/AppIcon/icon_list_user.png"
                    alt=""
                  />{{ item.CreateChnName }}</eagle-col
                >
                <eagle-col span="16">
                  <img
                    src="@/assets/Images/AppIcon/icon_list_date.png"
                    alt=""
                  />{{ getDateTime(item.CreateDate) }}</eagle-col
                >
              </eagle-row>
            </div>
          </div>
        </eagle-cell>
      </template>
    </eagle-page-list>
  </div>
</template>

<script>
import { getDateTime } from "@/utils/getDate";

export default {
  data() {
    return {
      list: [],
      params: {
          dataType: "Upload",
      }
    };
  },
  methods: {
    bindData(list) {
      this.list = list;
    },
    getDateTime(value) {
      return getDateTime(value);
    },
    goDetail(item) {
      this.$router.push({
        path: "/Danger/DangerCheckDetailView",
        query: { id: item.ID },
      });
    },
    // 编辑设备信息
    edit() {
      this.$router.push({
        path: "/Danger/HiddenDangerUpload",
        query:{ title:"隐患提报" }
      });
    },
  },
};
</script>

<style lang="less" scoped>

.warn_item {
  border-radius: 5px;
  position: relative;
}
.warn_header {
  display: flex;
  justify-content: space-between;
  position: relative;
  margin-bottom: 10px;
  .warn_tag {
    position: absolute;
    right: 0;
    top: 0;
    border-radius: 26.64rem 0 0 26.64rem;
  }
}
.dep_sort {
  // display: flex;
  // flex-wrap: wrap;
  // margin-bottom: 5px;
  img {
    height: 15px;
    width: 15px;
    margin-right: 5px;
  }
}

</style>
